﻿<!DOCTYPE html>

<html>

<head>
    <meta name="viewport" content="width=device-width" />
    <title></title>
    @Scripts.Render("~/Resource/js/fe.head.js")
</head>

<body>
    <div id="app" v-cloak>
        <div class="edit_pagecontainer">
            <div class="edit_formcontainer">
                <el-form ref="form" :model="form" :label-width="labelWidth" :rules="rules" style="height: 400px">
                        <el-form-item label="代码项名称" prop="CodeName">
                                <el-input v-model="form.CodeName"></el-input>
                            </el-form-item>
                            <el-form-item label="所属分组">
                                <common-tree :tree-data="treeData" tree-Model="single" :tree-select-value="form.GroupGuid"
                                    v-on:node-select-change="nodeChange" :tree-body-width="650">
                                </common-tree>
                            </el-form-item>
                            <el-form-item label="是否多级">
                                <el-radio v-model="form.IsLevel" :label="1">是</el-radio>
                                <el-radio v-model="form.IsLevel" :label="0">否</el-radio>
                            </el-form-item>
                            <el-form-item label="级别长度">
                                <el-input v-model="form.LevelLength"></el-input>
                            </el-form-item>
                            <el-form-item label="排序">
                                <el-input v-model="form.OrderNum"></el-input>
                            </el-form-item>
                </el-form>
            </div>
        </div>
        <div class="edit_opcontainer">
            <el-button type="primary" v-on:click="handleSubmit">保 存</el-button>
            <el-button v-on:click="close">取 消</el-button>
        </div>
    </div>
</body>
@Scripts.Render("~/Resource/js/fe.foot.js")
@Scripts.Render("~/Resource/component/tree/index.js")
<script>
    var treeUrl = GetRootPath() + "Frame/Group/Tree"
    var detailUrl = GetRootPath() + "Frame/CodeMain/FindDetail";
    var updateUrl = GetRootPath() + "Frame/CodeMain/OperateUpdate";
    var pageData = {
        //data
        form: {},
        treeData: [],
        rules: {
            CodeName: [{
                    required: true,
                    message: '请输入代码项名称',
                    trigger: 'blur'
                },

            ],

        },
        //css
        labelWidth: '100px'
    };

    new Vue({
        el: '#app',
        data: pageData,
        mounted: function () {
            this.bindDetail();
            bindTree()
        },
        methods: {
            bindDetail: function () {
                var data = {
                    RowGuid: GetUrlParam("RowGuid")
                }
                JsonAjaxPost(detailUrl, JSON.stringify(data), function (data,
                    status) {
                    if (data.code == 0) {
                        pageData.form = data.data
                    }
                })
            },
            handleSubmit: function () {
                this.$refs["form"].validate((valid) => {
                    if (valid) {
                        JsonAjaxPost(updateUrl, JSON.stringify(pageData.form), function (data,
                            status) {
                            if (data.code == 0) {
                                OpenSuccess('提示', '保存成功！', function () {
                                    CloseDialog();
                                })
                            } else {
                                OpenSuccess('提示', '保存失败！')
                            }
                        })
                    }
                });
            },
            close: function () {
                CloseDialog();
            },
            nodeChange: function (val) {
                pageData.form.GroupGuid = val;
            }
        }
    })

    function bindTree() {
        var data = {
            GroupTag: "Code"
        }
        JsonAjaxPost(treeUrl, JSON.stringify(data), function (data, status) {
            Vue.set(pageData, "treeData", data.tree);
        })
    }
</script>

</html>
